
import {useEffect,useState,useRef} from 'react'
// import {useLocation,useNavigate,Outlet} from 'react-router-dom'
import axios from 'axios'
import { Flex,Segmented,DatePicker,Input} from 'antd';
import type { DatePickerProps } from 'antd';
import type { Dayjs } from 'dayjs';
const { RangePicker } = DatePicker;
const getYearMonth = (date: Dayjs) => date.year() * 12 + date.month();
const disabled7DaysDate: DatePickerProps['disabledDate'] = (current, { from, type }) => {
    if (from) {
      const minDate = from.add(-6, 'days');
      const maxDate = from.add(6, 'days');
      switch (type) {
        case 'year':
          return current.year() < minDate.year() || current.year() > maxDate.year();
        case 'month':
          return (
            getYearMonth(current) < getYearMonth(minDate) ||
            getYearMonth(current) > getYearMonth(maxDate)
          );
        default:
          return Math.abs(current.diff(from, 'days')) >= 7;
      }
    }
    return false;
  };

// import ycon from './Mycontext.tsx//'
import Mymethods from './Mymethods.tsx'
// import Toptabs from './wycomponents/Segmented'
// import Filtertime from './wycomponents/Datatime'

import Footpage from './wycomponents/Jumppage'
import Cardbox from './wycomponents/Card'

const boxtop = {
    width: '1500px',
    height: '80px',
    borderRadius: 6,
    // border:'1px solid red',
    background:'white'
};
const boxcontext = {
    width: '1500px',
    height: '550px',
    borderRadius: 6,
    // border:'1px solid red',
    background:'white'
};

let ipt = {
    width:'150px'
}
let boxpage = {
  width:'1500px',
  height:'60px',
  borderRadius: 6,
  // border:'1px solid red',
  background:'white'
}


export default function Main(){
    // const [prd, setprd] = useState("初始数据");//
    const childRef = useRef(null);
    const parentMethod = () => {
        console.log('父组件的方法被调用');
    };
    const callChildMethod = () => {
        if (childRef.current) {
            childRef.current.childMethod();
        }
    };
    const onChange = (date: Dayjs | (Dayjs | null)[] | null, dateString: string | string[]) => {
        console.log(date, dateString);
      };
    useEffect(()=>{

    },[])

    return (
        <>
            <Flex wrap gap="large" justify='flex-start' align='center' style={boxtop}>
                <Segmented<string>
                    options={['全部', '待接诊', '已接诊', '已失效']}
                    onChange={(value) => {
                      console.log(value); // string
                    }}
                />
                <RangePicker onChange={onChange} disabledDate={disabled7DaysDate} />
                <Input placeholder='可输入门诊号、姓名' style={ipt}></Input>
            </Flex>
            <Flex wrap gap="middle" justify='space-around' align='center' style={boxcontext}>
                <Cardbox></Cardbox>
                {/* <ycon.Provider value={{ prd, setprd}}>//
                    <Cardbox></Cardbox>
                </ycon.Provider> */}
                {/* <Mymethods.Provider value={{ parentMethod }}>
                    <Cardbox ref={childRef} />
                    <button onClick={callChildMethod}>调用子组件方法</button>
                </Mymethods.Provider> */}
            </Flex>
            <Flex gap="middle" justify='space-around' align='center' style={boxpage}>
                <Footpage></Footpage>
            </Flex>

            


        </>
    )
}